<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
  <!-- build:css -->
  <link rel="stylesheet" href="../../lib/layui/css/layui.css">
  <link rel="stylesheet" href="../../css/theme/default.css" id="theme">
  <link rel="stylesheet" href="../../css/nprogress.css">
  <!-- endbuild -->
</head>
<div class="layui-fluid">
  <div class="layui-row">
    <div class="layui-col-xs12">
      <div class="layui-card">
        <div class="layui-card-body">
          <form class="layui-form" action="" lay-filter="formTest">
            <input type="text" name="id"  autocomplete="off"  hidden="true">
            <div class="layui-form-item">
              <label class="layui-form-label">登陆名</label>
              <div class="layui-input-inline">
                <input type="text" name="userName" required lay-verify="required|username" placeholder="请输入登陆名" autocomplete="off" class="layui-input">
              </div>
              <label class="layui-form-label">用户名</label>
              <div class="layui-input-inline">
                <input type="text" name="realName" required lay-verify="required" placeholder="请输入用户名" autocomplete="off" class="layui-input">
              </div>
            </div>
            <div class="layui-form-item">
              <label class="layui-form-label">手机</label>
              <div class="layui-input-inline">
                <input type="text" name="tel" required lay-verify="required" placeholder="请输入手机" autocomplete="off" class="layui-input">
              </div>
              <label class="layui-form-label">邮箱</label>
              <div class="layui-input-inline">
                <input type="text" name="email" required lay-verify="required|email" placeholder="请输入邮箱" autocomplete="off" class="layui-input">
              </div>
            </div>
            <!--<div class="layui-form-item">
              <label class="layui-form-label">选择框</label>
              <div class="layui-input-block">
                <select name="city" lay-verify="required">
                      <option value=""></option>
                      <option value="0">北京</option>
                      <option value="1">上海</option>
                      <option value="2">广州</option>
                      <option value="3">深圳</option>
                      <option value="4">杭州</option>
                    </select>
              </div>
            </div>-->
           <!-- <div class="layui-form-item">
              <label class="layui-form-label">复选框</label>
              <div class="layui-input-block">
                <input type="checkbox" name="like[write]" title="写作">
                <input type="checkbox" name="like[read]" title="阅读" checked>
                <input type="checkbox" name="like[dai]" title="发呆">
              </div>
            </div>-->
           <!-- <div class="layui-form-item">
              <label class="layui-form-label">开关</label>
              <div class="layui-input-block">
                <input type="checkbox" name="switch" lay-skin="switch">
              </div>
            </div>-->
          <!--  <div class="layui-form-item">
              <label class="layui-form-label">单选框</label>
              <div class="layui-input-block">
                <input type="radio" name="sex" value="男" title="男">
                <input type="radio" name="sex" value="女" title="女" checked>
              </div>
            </div>-->
            <!--<div class="layui-form-item layui-form-text">
              <label class="layui-form-label">文本域</label>
              <div class="layui-input-block">
                <textarea name="desc" placeholder="请输入内容" class="layui-textarea"></textarea>
              </div>
            </div>-->
            <div class="layui-form-item">
              <div class="layui-input-block">
                <button class="layui-btn" lay-submit lay-filter="formDemo" id="formDemo">提交</button>
                <button class="layui-btn layui-btn-primary" type="button" id="closeIframe" data-type="closeIframe">关闭</button>
              </div>
            </div>
            <!--type="reset"-->     <!--  -->

          </form>
          <!--type="reset"-->     <!--  -->
        </div>
      </div>
    </div>
  </div>
</div>
<!-- build:js -->
<script src="../../lib/polyfill.min.js"></script>
<script src="../../lib/layui/layui.all.js"></script>
<script src="../../mockjs/mockjs-config.js"></script>
<script src="../../js/utils.js"></script>
<script src="../../lib/axios.js"></script>
<script src="../../lib/jquery.js"></script>
<!-- endbuild -->
<script>
  //关闭iframe
    var index = window.parent.layer.getFrameIndex(window.name); //获取窗口索引
  //Demo
  layui.use(['form','layer','jquery'], function() {
      var index = window.parent.layer.getFrameIndex(window.name); //获取窗口索引
    var form = layui.form;
      var $ = layui.$ //重点处
      var id = getQueryStringByName("id");
      var type = getQueryStringByName("type");
      if(type ==='look'){
          $("#formDemo").remove();;
      }
      if (type ==='edit' ||type ==='look') {
          axios.get('/api/user/sysUser/selectOne/'+id, ).then(function (response) {
              if(response.data.code==200){
                  form.val("formTest",response.data.data)
                  //layer.msg(response.data.data)
                  //layer.msg(response.data.data+'</br>'+ field + ' 字段更改为：'+ value);
              }
          }) .catch(function (error) {
              console.log(error);
          });
      }
      form.render();
      form.verify({
          username: function(value, item){ //value：表单的值、item：表单的DOM对象
              if(!new RegExp("^[a-zA-Z0-9_\u4e00-\u9fa5\\s·]+$").test(value)){
                  return '用户名不能有特殊字符';
              }
              if(new RegExp("/^[\u4e00-\u9fa5]$/").test(value)){
                  return '用户名不能有中文';
              }
              if(/(^\_)|(\__)|(\_+$)/.test(value)){
                  return '用户名首尾不能出现下划线\'_\'';
              }
              if(/^\d+\d+\d$/.test(value)){
                  return '用户名不能全为数字';
              }
              axios.get('/api/user/sysUser/selectOneByName/'+value, ).then(function (response) {
                  if(response.data.code==200){
                      if(response.data.data=='' || response.data.data ==null||response.data.data.id==''||response.data.data.id!=id){
                          return '用户名重复';
                      }
                  }
              }) .catch(function (error) {
                  console.log(error);
              });
          }

          //我们既支持上述函数式的方式，也支持下述数组的形式
          //数组的两个值分别代表：[正则匹配、匹配不符时的提示文字]
          ,pass: [
              /^[\S]{6,12}$/
              ,'密码必须6到12位，且不能出现空格'
          ]
      });

      //查询方法
      var $ = layui.$, active = {
          closeIframe: function(){
              window.parent.layer.close(index);
          }
      };
      $('#closeIframe').on('click', function(){
          var type = $(this).data('type');
          active[type] ? active[type].call(this) : '';
      });
      //监听提交
    form.on('submit(formDemo)', function(data) {
      //layer.msg(JSON.stringify(data.field));
        axios.post('/api/user/sysUser/updateOrInsertByUser', data.field).then(function (response) {
            if(response.data.code==200){
                //form.val("formTest",response.data.data)
                layer.msg(response.data.msg,
                    {icon: 1,
                    time: 1000 }//2秒关闭（如果不配置，默认是3秒）
                 ,function () {
                    //向父页面传参
                     $('#isReload', window.parent.document).val('2');
                      window.parent.layer.close(index);
                })
            }else{
                layer.msg(response.data.msg)
            }
        }) .catch(function (error) {
            console.log(error);
        });
      return false;
    });

  });
</script>

<style scoped>

</style>
</html>